import type { FC, ReactNode } from 'react'
import { memo, useEffect } from 'react'
import { useNavigate, useParams } from 'react-router'
import ChangePage from '@/pages/system/loading/change-page.tsx'
import { _PAGE_ } from '@/consts/system.ts'

interface IProps {
  children?: ReactNode
}

const Index: FC<IProps> = () => {
  const params = useParams()
  const navigate = useNavigate()
  const { save } = params
  let toView: string = '/ruom'
  const View = <ChangePage></ChangePage>
  // let
  switch (save) {
    case _PAGE_.ruim.label:
      toView = _PAGE_.ruim.value
      break
    case _PAGE_.ruom.label:
      toView = _PAGE_.ruom.value
      break
    default:
      break
  }
  const timer = setTimeout(() => {
    navigate(toView)
  }, 500)
  // 使用useEffect来处理副作用
  useEffect(() => {
    // 设置一个清理函数
    // 返回清理函数，它将在组件卸载时调用
    return () => {
      // console.log('组件将要卸载，执行清理工作')
      // 这里执行你的清理逻辑，例如取消订阅，清除定时器等
      clearTimeout(timer)
    }
  }, [timer]) // 注意这里传递了一个空数组，这意味着此effect只会在组件挂载时运行一次，并且只在组件卸载时进行清理
  return View
}

export default memo(Index)
